<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css滤镜效果</title>
    <style type="text/css">
        /*图片变黑白 grayscale 灰度*/
        /*a:link img {filter:grayscale(100%);}
        a:hover img {filter:grayscale(10%);}*/
        /*图片变模糊 blur 显示像素的清晰度*/
        a:link img {filter:blur(10px);}
        a:hover img {filter:blur(0px);}
    </style>
</head>
<body>
<!--
IE对滤镜支持不够好 通过就是js实现
-->
<a href="#"><img width="150px" src="../qiu.jpg" alt=""></a>
<a href="#"><img width="150px" src="../table/tianmao.png" alt=""></a>
</body>
</html>